<template>
  <div class="zs_manager">
    <!-- <div style="height:8%;width:100%;position:fixed;z-index:1;background:#f9f9f9;margin-top: -28px;display:flex;align-item:center;margin-left:-25px;" class="fin_header">
      <span>证书管理</span>
    </div> -->
    <div class="header">
      <div class="header_span">
        <cell-header :title="`证书管理`" :type="1"/>
      </div>
    </div>
    <div style="position: relative;overflow-y:hidden;">
      <el-card shadow="never" style="width: 100%;position:relative;margin-top: 42px;" class="card_height">
        <div class="bind_button"><el-button type="success" @click="goBind">绑定证书</el-button></div>
        <zsManager></zsManager>
      <!-- <el-tabs v-model="activeName">
        <el-tab-pane label="密钥绑定" name="first">
          <zsBind @changeOpen="changeOpen"/>
        </el-tab-pane>
        <el-tab-pane label="密钥列表" name="second">
          <zsManager :activeName="activeName" @changeOpen="changeOpen"/>
        </el-tab-pane>
      </el-tabs> -->
    </el-card>
    </div>
  </div>
</template>

<script>
import zsBind from './zs-bind.vue'
import zsManager from './zs-manager.vue'
import cellHeader from '@/components/cell-header.vue'
import {
    asyncRoutes
  } from "@/router";
export default {
  name: 'Manager',
  components: {
    cellHeader,
    zsBind,
    zsManager
  },
  data() {
    return {
      activeName: 'first',
      isClick: false,
      dataPub: ''
    }
  },
  watch: {
    activeName: {
      immediate: true,
      handler:function(newV,oldV) {
        this.activeName = newV
      }
    }
  },
  methods: {
    goBind() {
      this.$router.push({
        path: '/user/zs_bind'
      })
    },
    changeOpen(data) {
      this.activeName = data
    },
    publicData(data) {
      this.dataPub = data
    }
  }
}
</script>

<style lang="scss" scoped>
@import "~@/styles/variables.scss";
.card_height {
  min-height: calc(100vh - 175px);
}
.header {
  width: 100%;
  // border: 1px solid red;
  height: 70px;
  position: fixed;
  // left: 0;
  margin-top: -25.7px;
  z-index: 99;
  background: #f9f9f9;
  .header_span {
    position: absolute;
    margin-top: 24px;
    // margin-left: 105px;
  }
}
.bind_button {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 25px;
  margin-top: 5px;
}
</style>
